<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/fragment::top">

</head>

<body>
<div class="lyear-layout-web">
  <div class="lyear-layout-container">
    <!--左侧导航-->
    <div th:replace="common/fragment::leftmenu"></div>
    <!--End 左侧导航-->

    <!--头部信息-->
    <div th:replace="common/fragment::header"></div>
    <!--End 头部信息-->

    <!--页面主要内容-->
    <main class="lyear-layout-content">

      <div class="container-fluid">
        <div class="row">
          <div class="col-lg-12">
            <div class="card">
              <div class="card-toolbar clearfix">
                <form action="" class="pull-right search-bar" method="get" role="form">
                  <div class="input-group">
                    <div class="input-group-btn">
                      <input id="search-field" name="search_field" type="hidden" value="title">
                      <button aria-expanded="false" aria-haspopup="true"
                              class="btn btn-default dropdown-toggle" data-toggle="dropdown"
                              id="search-btn"
                              type="button">
                        名称 <span class="caret"></span>
                      </button>
                      <ul class="dropdown-menu">
                        <li><a data-field="title" href="javascript:void(0)" tabindex="-1">名称</a>
                        </li>
                      </ul>
                    </div>

                    <input class="form-control" id="keyword-find-rolename" name="keyword"
                           placeholder="请输入名称" type="text"
                           value="">
                    <span class="input-group-btn">
                                              <button class="btn btn-primary" id="keyword-find-btn"
                                                      onclick="keywordsearch()"
                                                      type="button">搜索</button>
                                            </span>

                  </div>
                </form>

                <div class="toolbar-btn-action">

                  <div class="btn-group">
                    <button aria-expanded="false" aria-haspopup="true"
                            class="btn btn-primary dropdown-toggle" data-toggle="dropdown"
                            type="button">
                      供应商列表 <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" id="supplier-choose" th:if="${supplierlist ne null}">
                      <li th:each="supplier:${supplierlist}"><a th:href="@{${supplier.id}}"
                                                                th:text="${supplier.name}">夜的第七章</a>
                      </li>

                    </ul>

                  </div>

                  <!-- 供应商信息 -->
                  <div class="card-body">
                    <div class="table-responsive">
                      <table class="table table-bordered">
                        <thead>
                        <tr>
                          <th>名称</th>
                          <th>地址</th>
                          <th>联系人</th>
                          <th>电话</th>
                          <th>email</th>
                          <th>状态</th>
                          <th>备注</th>
                        </tr>
                        </thead>
                        <tbody th:if="${currentsupplier ne null}">
                        <tr>
                          <td hidden="hidden"><input id="current_id"
                                                     th:value="${currentsupplier.id}"
                                                     type="text"></td>
                          <td th:text="${currentsupplier.name}"></td>
                          <td th:text="${currentsupplier.address}"></td>
                          <td th:text="${currentsupplier.linkman}"></td>
                          <td th:text="${currentsupplier.phone}"></td>
                          <td th:text="${currentsupplier.email}"></td>
                          <!--                          <td th:text="${currentsupplier.status}"></td>-->
                          <td th:switch="${currentsupplier.status}">
                            <i style="color: #0FB25F" th:case="1" th:text="启用"></i>
                            <i style="color: #985f0d;" th:case="-1" th:text="禁用"></i></td>
                          </td>
                          <td th:text="${currentsupplier.comment}"></td>
                        </tr>

                        </tbody>
                      </table>
                    </div>

                  </div>
                </div>
              </div>

              <!-- END供应商信息 -->
              <div class="card-body">
                <div class="table-responsive">
                  <!--添加商品按钮-->
                  <div class="btn-group">
                    <!--<button aria-expanded="false" aria-haspopup="true"
                            class="btn btn-primary dropdown-toggle" data-toggle="dropdown"
                            type="button">添加商品<span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" id="good-choose">
                    </ul>-->
                    <button class="btn btn-primary" data-target=".bs-example-modal-lg"
                            data-toggle="modal"
                            id="add-good-to-supplier" type="button">商品模态框
                    </button>
                  </div>


                  <!--END 添加商品按钮-->
                  <table class="table table-bordered">
                    <thead>
                    <tr>
                      <!--                      <th>序号</th>-->
                      <th hidden="hidden">id</th>
                      <th>商品名称</th>
                      <!--    <th>角色图标</th>-->
                      <th>商品规格</th>
                      <th>计量单位</th>
                      <th>状态</th>
                      <th>备注</th>
                      <th>操作</th>
                    </tr>
                    </thead>
                    <tbody th:if="${owngoodlist ne null}">
                    <tr th:each="good:${owngoodlist}">
<!--                      <td>-->
<!--                        <label class="lyear-checkbox checkbox-primary">-->
<!--                          <input name="ids[]" type="checkbox" value="1"><span></span>-->
<!--                        </label>-->
<!--                      </td>-->
                      <!--                      <td th:text="${goodStat.index+1}"></td>-->
                      <td hidden="hidden" th:text="${good.id}"></td>

                      <td th:text="${good.name}"></td>
                      <td th:text="${good.spec}"></td>
                      <!--                                            <td th:text="${good.pk}"></td>-->
                      <td th:text="${good.unit}"></td>
                      <td th:switch="${good.status}">
                        <i style="color: #0FB25F" th:case="1" th:text="启用"></i>
                        <i style="color: #985f0d;" th:case="-1" th:text="禁用"></i></td>
                      </td>

                      <td th:text="${good.comment}"></td>

                      <td>
                        <div class="btn-group">
                          <!--<a class="btn btn-xs btn-default editgood"
                             data-toggle="tooltip"
                             th:href="@{${good.id}}" title="编辑">
                            <i class="mdi mdi-pencil"></i>
                          </a>-->
                          <a class="btn btn-xs btn-default removegood"
                             data-toggle="tooltip"

                             th:href="@{${good.id}}" title="移除">
                            <i class="mdi mdi-alert-outline"></i>
                          </a>
                        </div>
                      </td>
                    </tr>

                    </tbody>
                  </table>
                </div>

              </div>
            </div>
          </div>

        </div>


      </div>
    </main>
    <!--End 页面主要内容-->
    <!--End 页面主要内容-->
  </div>
</div>
<!--模态框-->
<div aria-labelledby="myLargeModalLabel" class="modal fade bs-example-modal-lg" role="dialog"
     tabindex="-1">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button aria-label="Close" class="close" data-dismiss="modal" type="button"><span
            aria-hidden="true">×</span></button>
        <h4 class="modal-title" id="myLargeModalLabel">商品</h4>
      </div>
      <div class="modal-body">
        <div class="card-body">
          <div class="table-responsive">
            <table class="table table-bordered">
              <thead>
              <tr>
                <th>
                  <label class="lyear-checkbox checkbox-primary">
                    <input id="check-all" type="checkbox"><span></span>
                  </label>
                </th>
                <!--                <th>序号</th>-->
                <th hidden="hidden">id</th>
                <th>名称</th>
                <!--    <th>角色图标</th>-->
                <th>商品规格</th>
                <!--                                            <th>包装</th>-->
                <th>计量单位</th>
                <th>状态</th>
                <th>备注</th>
                <th>操作</th>
              </tr>
              </thead>
              <tbody th:if="${othergoodlist ne null}">
              <tr th:each="good:${othergoodlist}" th:if="${good ne null}">
                <td>
                  <label class="lyear-checkbox checkbox-primary">
                    <input name="ids[]" th:value="${good.id}" type="checkbox"><span></span>
                  </label>
                </td>
                <!--                <td th:text="${goodStat.index+1}"></td>-->

                <td th:text="${good.name}"></td>
                <td th:text="${good.spec}"></td>
                <!--                                            <td th:text="${good.pk}"></td>-->

                <td th:text="${good.unit}"></td>
                <td th:switch="${good.status}">
                  <i style="color: #0FB25F" th:case="1" th:text="启用"></i>
                  <i style="color: #985f0d;" th:case="-1" th:text="禁用"></i></td>
                </td>

                <td th:text="${good.comment}"></td>

                <!--<td>
                  <div class="btn-group">
                    <a class="btn btn-xs btn-default editgood"
                       data-toggle="tooltip"
                       th:href="@{${good.id}}" title="编辑">
                      <i class="mdi mdi-pencil"></i>
                    </a>
                    <a class="btn btn-xs btn-default forbidden"
                       data-toggle="tooltip"

                       th:href="@{${good.id}}" title="禁用">
                      <i class="mdi mdi-alert-outline"></i>
                    </a>
                  </div>
                </td>-->
              </tr>
              </tbody>
            </table>
          </div>

        </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-default" data-dismiss="modal" type="button">关闭</button>
        <button class="btn btn-primary" id="add_good_to_supplier_btn" type="button">保存</button>
      </div>
    </div>
  </div>
</div>
<!--END模态框-->
<div th:replace="common/fragment::tail-script"></div>
<script type="text/javascript">
  // 入口
  $(document).ready(function () {
    // 保存 供应商id -- 全局
    let current_supplied_id = $('#current_id').val()

    // 商品单元数组
    let goodunit = ["散装", "包", "公斤", "吨", "件", "套"]

    // 更新数据-- 包括供应商 和 拥有的商品列表, 模态框中非拥有的商品表
    $('#supplier-choose a').each(function (i, e) {
      $(e).click(function (event) {
        let id = $(this).attr('href')
        // console.log("/supplier/supplierandgoodlist.do?id="+id)
        let h = "/supplier/supplierandgoodlist.do?getid=" + id
        window.location.replace(h)
        event.preventDefault()
        return false
      })
    });

    // 模态框点击保存 商品
    let add_goog_ary = []
    $('#add_good_to_supplier_btn').click(function () {
      add_goog_ary = []
      $("input[name='ids[]']:checked").each(function (i, e) {
        let goodid = $(e).val()
        let d = {"id": parseInt(goodid)}
        add_goog_ary.push(d)
      })

      temp_id = parseInt(current_supplied_id)
      let data = {
        "id": temp_id,
        "good": add_goog_ary
      }

      // 提交保存 商品
      post_ajax("/supplier/add_good_to_supplier.ajax", data,
          "/supplier/supplierandgoodlist.do?getid=" + current_supplied_id)


    });

    // 移除商品
    $('.removegood').each(function (i,e) {

      let good_ary=[]

      $(e).click(function (eve) {
        let id = parseInt($(e).attr('href'))
        let t = {id:id}
        good_ary.push(t)

        let data = {
          id: parseInt(current_supplied_id),
          good:good_ary
        }
        post_ajax("/supplier/removegood.ajax",data,"/supplier/supplierandgoodlist.do?getid=" + current_supplied_id)
        eve.preventDefault()
        return false;
      });

    });

  });


</script>
</body>
</html>